// 弹窗组件 MyFormDialog.vue
<template>
  <el-dialog title="修改数据">
    <el-form
      :model="form1"
      ref="form1"
      label-width="85px"
      v-if="parentDatase1 ? true : false"
    >
      <el-form-item label="入院日期">
        <!-- <van-field
          readonly
          clickable
          placeholder="请选择日期"
          is-link
          v-model="form1.date1"
          @click="form1.showCalendar1 = true"
        />
        <van-calendar
          ref="form1.date1"
          switch-mode="year-month"
          :min-date="new Date('2000-01-01')"
          :show="form1.showCalendar1"
          @confirm="onConfirmDate1($event, 'date1')"
          @close="form1.showCalendar1 = false"
        /> -->
        <el-date-picker
        :editable="false"
          v-model="form1.date1"
          @change="onConfirmDate1($event, 'date1')"
          placeholder="请选择日期时间"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item label="出院院日期">
        <!-- <van-field
          readonly
          clickable
          placeholder="请选择日期"
          is-link
          v-model="form1.date2"
          @click="form1.showCalendar2 = true"
        />
        <van-calendar
          ref="form1.date1"
          switch-mode="year-month"
          :min-date="new Date('2000-01-01')"
          :show="form1.showCalendar2"
          @confirm="onConfirmDate1($event, 'date2')"
          @close="form1.showCalendar2 = false"
        /> -->
        <el-date-picker
        :editable="false"
          v-model="form1.date2"
          @change="onConfirmDate1($event, 'date2')"
          placeholder="请选择日期时间"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item label="原因">
        <el-input v-model="form1.date3" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="医疗机构名称">
        <el-input v-model="form1.date4" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="病案号">
        <el-input v-model="form1.date5" autocomplete="off"></el-input>
      </el-form-item>
    </el-form>
    <el-form
      :model="form5"
      ref="form5"
      label-width="85px"
      v-if="parentDatasesx ? true : false"
    >
      <el-form-item label="确诊日期">
        <!-- <van-field
          readonly
          clickable
          placeholder="请选择日期"
          is-link
          v-model="form1.date1"
          @click="form1.showCalendar1 = true"
        />
        <van-calendar
          ref="form1.date1"
          switch-mode="year-month"
          :min-date="new Date('2000-01-01')"
          :show="form1.showCalendar1"
          @confirm="onConfirmDate1($event, 'date1')"
          @close="form1.showCalendar1 = false"
        /> -->
        <el-date-picker
        :editable="false"
          v-model="form5.date1"
          @change="onConfirmDatesx($event, 'date1')"
          placeholder="请选择日期时间"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item label="原因">
        <el-input v-model="form5.date2" autocomplete="off"></el-input>
      </el-form-item>
    </el-form>
    <el-form
      :model="form2"
      ref="form2"
      label-width="85px"
      v-if="parentDatase2 ? true : false"
    >
      <el-form-item label="建床日期">
        <!-- <van-field
          readonly
          clickable
          placeholder="请选择日期"
          is-link
          v-model="form2.date1"
          @click="form2.showCalendar1 = true"
        />
        <van-calendar
          ref="form1.date1"
          switch-mode="year-month"
          :min-date="new Date('2000-01-01')"
          :show="form2.showCalendar1"
          @confirm="onConfirmDate2($event, 'date1')"
          @close="form2.showCalendar1 = false"
        /> -->
        <el-date-picker
        :editable="false"
          v-model="form2.date1"
          @change="onConfirmDate2($event, 'date1')"
          placeholder="请选择日期时间"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item label="撤床日期">
        <!-- <van-field
          readonly
          clickable
          placeholder="请选择日期"
          is-link
          v-model="form2.date2"
          @click="form2.showCalendar2 = true"
        />
        <van-calendar
          ref="form1.date1"
          switch-mode="month"
          :min-date="new Date('2000-01-01')"
          :show="form2.showCalendar2"
          @confirm="onConfirmDate2($event, 'date2')"
          @close="form2.showCalendar2 = false"
        /> -->
        <el-date-picker
        :editable="false"
          v-model="form2.date2"
          @change="onConfirmDate2($event, 'date2')"
          placeholder="请选择日期时间"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item label="原因">
        <el-input v-model="form2.date3" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="医疗机构名称">
        <el-input v-model="form2.date4" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="病案号">
        <el-input v-model="form2.date5" autocomplete="off"></el-input>
      </el-form-item>
    </el-form>
    <el-form
      :model="form3"
      ref="form3"
      label-width="85px"
      v-if="parentDatase3 ? true : false"
    >
      <el-form-item label="名称">
        <el-input v-model="form3.name" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="接种日期">
        <!-- <van-field
          readonly
          clickable
          placeholder="请选择日期"
          is-link
          v-model="form3.date1"
          @click="form3.showCalendar1 = true"
        />
        <van-calendar
          ref="form1.date1"
          switch-mode="year-month"
          :show="form3.showCalendar1"
          :min-date="new Date('2000-01-01')"
          @confirm="onConfirmDate3($event, 'date1')"
          @close="form3.showCalendar1 = false"
        /> -->
        <el-date-picker
        :editable="false"
          v-model="form3.date1"
          @change="onConfirmDate3($event, 'date1')"
          placeholder="请选择日期时间"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item label="接种机构">
        <el-input v-model="form3.date2" autocomplete="off"></el-input>
      </el-form-item>
    </el-form>
    <el-form
      :model="form4"
      ref="form4"
      label-width="85px"
      v-if="parentDatase4 ? true : false"
    >
      <p class="ypxx" @click="showDialogss1 = true">药品查询</p>
      <form-dialog3
        v-model="showDialogss1"
        @submitss1="handleSubmitss1"
        :parentDatass1="messagess1"
      ></form-dialog3>
      <!-- <el-form-item label="药品分类">
        <el-select v-model="form4.date9_id" placeholder="Select">
          <el-option
            v-for="item in optionss"
            :key="item.Type_ID"
            :label="item.Type_Name"
            :value="item.Type_ID"
          />
        </el-select>
        <van-calendar
          ref="form1.date2"
          switch-mode="year-month"
          :show="form1.showCalendar1"
          @confirm="onConfirmDate1($event, 'date1')"
          @close="form1.showCalendar1 = false"
        />
      </el-form-item> -->
      <el-form-item label="药物名称">
        <el-input v-model="form4.name" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="用法">
        <el-select v-model="form4.date1_id" placeholder="Select" size="large">
          <el-option
            v-for="item in options"
            :key="item.Use_ID"
            :label="item.Use_Name"
            :value="item.Use_ID"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="用量周期">
        <el-select v-model="form4.date2_id" placeholder="Select" size="large">
          <el-option
            v-for="item in options1"
            :key="item.Use_ID"
            :label="item.Use_Name"
            :value="item.Use_ID"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="用量次数">
        <el-input
          v-model="form4.date3"
          @input="handleInput3"
          autocomplete="off"
        ></el-input>
      </el-form-item>
      <el-form-item label="每次用量">
        <el-input
          v-model="form4.date4"
          @input="handleInput4"
          autocomplete="off"
        ></el-input>
      </el-form-item>
      <el-form-item label="用量单位">
        <el-select v-model="form4.date5_id" placeholder="Select" size="large">
          <el-option
            v-for="item in options2"
            :key="item.Use_ID"
            :label="item.Use_Name"
            :value="item.Use_ID"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="用药时间">
        <el-input
          v-model="form4.date6"
          @input="handleInput6"
          autocomplete="off"
        ></el-input>
      </el-form-item>
      <el-form-item label="用药时间单位">
        <el-select v-model="form4.date7_id" placeholder="Select" size="large">
          <el-option
            v-for="item in options3"
            :key="item.Use_ID"
            :label="item.Use_Name"
            :value="item.Use_ID"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="服药依从性">
        <el-select v-model="form4.date8_id" placeholder="Select" size="large">
          <el-option
            v-for="item in options4"
            :key="item.Use_ID"
            :label="item.Use_Name"
            :value="item.Use_ID"
          />
        </el-select>
      </el-form-item>
    </el-form>
    <div slot="footer">
      <div class="dialog-footer">
        <el-button @click="cance">取 消</el-button>
        <el-button type="primary" @click="submitForm">确 定</el-button>
      </div>
    </div>
  </el-dialog>
</template>

<script>
import FormDialog3 from "../../components/jkwd/FormDialog3.vue";
import moment from "moment";
import { userStore } from "../../stores/user.ts";
export default {
  data() {
    return {
      showDialogss1: false,
      messagess1: "0",
      form1: {
        data: "",
        date1: "",
        date2: "",
        date3: "",
        date4: "",
        date5: "",
        showCalendar1: false,
        showCalendar2: false,
        dialogVisible: true,
      },
      form2: {
        data: "",
        date1: "",
        date2: "",
        date3: "",
        date4: "",
        date5: "",
        showCalendar1: false,
        showCalendar2: false,
        dialogVisible: true,
      },
      form3: {
        data: "",
        name: "",
        date1: "",
        date2: "",
        showCalendar1: false,
        dialogVisible: true,
      },
      form4: {
        // data: "",
        // name: "",
        // date1: "",
        // date2: "",
        // date3: "",
        // date4: "",
        // date5: "",
        // date6: "",
        // date7: "",
        // date8: "",
        // date9: "",
        // date1_id: "",
        // date2_id: "",
        // date5_id: "",
        // date7_id: "",
        // date8_id: "",
        // date9_id: "",
        // showCalendar1: false,
        // dialogVisible: true,
      },
      form5:{
          date1:'',
          date2:"",
          dialogVisible:""
      },
      Interface_Code: "",
      User_Code: "",
      options: [],
      options1: [
        { Use_ID: "1", Use_Name: "每日" },
        { Use_ID: "2", Use_Name: "每周" },
        { Use_ID: "3", Use_Name: "每月" },
        { Use_ID: "4", Use_Name: "每季度" },
      ],
      optionss: [],
      options2: [],
      options3: [
        { Use_ID: "1", Use_Name: "年" },
        { Use_ID: "2", Use_Name: "月" },
        { Use_ID: "3", Use_Name: "日" },
      ],
      options4: [
        { Use_ID: "1", Use_Name: "规律" },
        { Use_ID: "2", Use_Name: "间断" },
        { Use_ID: "3", Use_Name: "不服药" },
      ],
      indexs1: "",
      indexs2: "",
      indexs3: "",
      indexs4: "",
      indexs5:""
    };
  },
  props: ["parentDatase1", "parentDatase2", "parentDatase3", "parentDatase4","parentDatasesx"],
  created() {
    this.Interface_Code = sessionStorage.getItem("item");
    this.User_Code = JSON.parse(sessionStorage.getItem("UserInfo")).sUser_Code;
    this.user = userStore();
    this.GetMediUseInfo();
    this.GetMediTypes();
  },
  components: {
    FormDialog3,
  },
  methods: {
    handleInput3(value) {
      // 使用正则表达式匹配非数字字符，并将其替换为空字符串
      this.form4.date3 = value.replace(/[^\d]/g, "");
    },
    handleInput4(value) {
      // 使用正则表达式匹配非数字字符，并将其替换为空字符串
      this.form4.date4 = value.replace(/[^\d]/g, "");
    },
    handleInput6(value) {
      // 使用正则表达式匹配非数字字符，并将其替换为空字符串

      this.form4.date6 = value.replace(/[^\d]/g, "");
    },
    GetMediTypes() {
      axios
        .post(
          window.globalUrl.server + "Service.asmx/GetMediTypes",
          JSON.stringify({
            User_Code: this.User_Code,
            Interface_Code: this.Interface_Code,
          })
        )
        .then((res) => {
          this.optionss = JSON.parse(res.data.RltData);
        })
        .catch((eorro) => {});
    },
    receiveData1(data, index) {
      console.log("wwww1111", this.parentDatase4);
      this.form1 = data;
      this.indexs1 = index;
    },
    receiveData2(data, index) {
      console.log("wwww1111", this.parentDatase4);
      this.form2 = data;
      this.indexs2 = index;
    },
    receiveData3(data, index) {
      console.log("wwww1111", this.parentDatase4);
      this.form3 = data;
      this.indexs3 = index;
    },
    receiveData4(data, index) {
      console.log("wwww1111", this.parentDatase4);
      this.form4 = data;
      console.log("xjj", this.form4);
      this.indexs4 = index;
    },
    receiveDatasx(data, index) {
      console.log("wwww1111", this.parentDatase4);
      this.form5 = data;
      console.log("xjj", this.form5);
      this.indexs5 = index;
    },
    handleSubmitss1(data1, data2) {
      console.log(data1, data2);
      this.form4 = {
        name: data2.Medi_Name,
        date1_id: data2.Medi_Use,
        date2_id: data2.Medi_freq,
        date3: data2.Medi_EachDose,
        date4: data2.Medi_EachDoseUnit,
        date5_id: data2.Medi_DoseUnit,
        date6: (data2.Medi_UseDate.match(/\d+/g) || []).join(""),
        date7_id: data2.Medi_UseDateUnit,
        date8_id: data2.Medi_MedicineYield,
        date9: data2.Medi_Sugg,
        // date9_id: data2.Medi_TypeID,
      };
      this.showDialogss1 = data1;
      console.log(data1, data2);
    },
    GetMediUseInfo() {
      axios
        .post(
          window.globalUrl.server + "Service.asmx/GetMediUseInfo",
          JSON.stringify({
            User_Code: this.User_Code,
            Interface_Code: this.Interface_Code,
          })
        )
        .then((res) => {
          this.options = JSON.parse(res.data.RltData);
          console.log(JSON.parse(res.data.RltData));
        });
      axios
        .post(
          window.globalUrl.server + "Service.asmx/GetMediUseUnits",
          JSON.stringify({
            User_Code: this.User_Code,
            Interface_Code: this.Interface_Code,
          })
        )
        .then((res) => {
          this.options2 = JSON.parse(res.data.RltData);
          console.log("11111", JSON.parse(res.data.RltData));
        });
    },
    formatDate(date) {
      return moment(date).format("YYYY-MM-DD");
    },
    onConfirm1(value) {
      this.form1.date1 = this.formatDate(value);
      this.form1.showCalendar = false;
    },
    onConfirmDate1(date, field) {
      console.log(date);
      console.log(field);
      if (field === "date1") {
        this.form1.date1 = this.formatDate(date);
        this.form1.showCalendar1 = false;
      } else {
        this.form1.date2 = this.formatDate(date);
        this.form1.showCalendar2 = false;
      }
    },
    onConfirmDate2(date, field) {
      console.log(date);
      console.log(field);
      if (field === "date1") {
        this.form2.date1 = this.formatDate(date);
        this.form2.showCalendar1 = false;
      } else {
        this.form2.date2 = this.formatDate(date);
        this.form2.showCalendar2 = false;
      }
    },
    onConfirmDate3(date, field) {
      console.log(date);
      console.log(field);
      if (field === "date1") {
        this.form3.date1 = this.formatDate(date);
        this.form3.showCalendar1 = false;
      }
    },
    cance() {
      if (this.parentData1 == "0") {
        this.form1.dialogVisible = false;
        // 触发事件，传递数据给父组件
        this.$emit("s1", this.form1.dialogVisible);
      }
      if (this.parentData2 == "1") {
        this.form2.dialogVisible = false;
        // 触发事件，传递数据给父组件
        this.$emit("s2", this.form2.dialogVisible);
      }
      if (this.parentData3 == "2") {
        this.form3.dialogVisible = false;
        // 触发事件，传递数据给父组件
        this.$emit("s3", this.form3.dialogVisible);
      }
      if (this.parentData4 == "3") {
        this.form4.dialogVisible = false;
        // 触发事件，传递数据给父组件
        this.$emit("s4", this.form4.dialogVisible);
      }
       if (this.parentData4 == "sx") {
        this.form5.dialogVisible = false;
        // 触发事件，传递数据给父组件
        this.$emit("ssx", this.form5.dialogVisible);
      }
    },
    submitForm() {
      // 表单验证逻辑
      // ...
      console.log(this.parentData1);
      if (this.parentDatase1) {
        this.form1.dialogVisible = false;
        // 触发事件，传递数据给父组件
        this.$emit(
          "submitse1",
          this.form1,
          this.form1.dialogVisible,
          this.indexs1
        );
        this.form1 = [];
      }
      if (this.parentDatase2) {
        this.form2.dialogVisible = false;
        // 触发事件，传递数据给父组件
        this.$emit(
          "submitse2",
          this.form2,
          this.form2.dialogVisible,
          this.indexs2
        );
        this.form2 = [];
      }
      if (this.parentDatase3) {
        this.form3.dialogVisible = false;
        // 触发事件，传递数据给父组件
        this.$emit(
          "submitse3",
          this.form3,
          this.form3.dialogVisible,
          this.indexs3
        );
        this.form3 = [];
      }
      // if (this.parentData4 == "3") {
      //   this.form4.dialogVisible = false;
      //   this.options.forEach((item) => {
      //     if (item.Use_ID == this.form4.date1) {
      //       this.form4.date1_id = this.form4.date1;
      //       this.form4.date1 = item.Use_Name;
      //     }
      //   });
      //   this.options1.forEach((item) => {
      //     if (item.Use_ID == this.form4.date2) {
      //       this.form4.date2_id = this.form4.date2;
      //       this.form4.date2 = item.Use_Name;
      //     }
      //   });
      //   this.options2.forEach((item) => {
      //     if (item.Use_ID == this.form4.date5) {
      //       this.form4.date5_id = this.form4.date5;
      //       this.form4.date5 = item.Use_Name;
      //     }
      //   });
      //   this.options3.forEach((item) => {
      //     if (item.Use_ID == this.form4.date7) {
      //       this.form4.date7_id = this.form4.date7;
      //       this.form4.date7 = item.Use_Name;
      //     }
      //   });
      //   this.options4.forEach((item) => {
      //     if (item.Use_ID == this.form4.date8) {
      //       this.form4.date8_id = this.form4.date8;
      //       this.form4.date8 = item.Use_Name;
      //     }
      //   });
      //   // 触发事件，传递数据给父组件
      //   this.$emit("submitse4", this.form4, this.form4.dialogVisible);
      //   this.form4 = [];
      // }

      if (this.parentDatase4) {
        this.options.forEach((item) => {
          if (item.Use_ID == this.form4.date1_id) {
            this.form4.date1_id = this.form4.date1_id;
            this.form4.date1 = item.Use_Name;
          }
        });
        this.options1.forEach((item) => {
          if (item.Use_ID == this.form4.date2_id) {
            this.form4.date2_id = this.form4.date2_id;
            this.form4.date2 = item.Use_Name;
          }
        });
        this.options2.forEach((item) => {
          if (item.Use_ID == this.form4.date5_id) {
            this.form4.date5_id = this.form4.date5_id;
            this.form4.date5 = item.Use_Name;
          }
        });
        this.options3.forEach((item) => {
          if (item.Use_ID == this.form4.date7_id) {
            this.form4.date7_id = this.form4.date7_id;
            this.form4.date7 = item.Use_Name;
          }
        });
        this.options4.forEach((item) => {
          if (item.Use_ID == this.form4.date8_id) {
            this.form4.date8_id = this.form4.date8_id;
            this.form4.date8 = item.Use_Name;
          }
        });
        // this.optionss.forEach((item) => {
        //   if (item.Type_ID == this.form4.date9_id) {
        //     this.form4.date9_id = this.form4.date9_id;
        //     this.form4.date9 = item.Type_Name;
        //   }
        // });
        this.$emit(
          "submitse4",
          this.form4,
          this.form4.dialogVisible,
          this.indexs4
        );
        this.form4 = [];
      }
      if(this.parentDatasesx){
        this.form5.dialogVisible = false;
        // 触发事件，传递数据给父组件
        this.$emit(
          "submitsesx",
          this.form5,
          this.form5.dialogVisible,
          this.indexs5
        );
        this.form5 = [];
      }
    },
  },
};
</script>
<style scoped>
::v-deep .el-dialog__header {
  padding-bottom: 0px !important;
}
::v-deep .ypxx {
  text-align: right;
  padding: 10px;
  color: dodgerblue;
}
::v-deep .el-form-item {
  margin-bottom: 3px;
}
::v-deep .el-form-item__label {
  font-size: 12px !important;
}
::v-deep .dialog-footer {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}
::v-deep .van-field {
  border-bottom: 0px solid !important;
  align-items: center;
  background-color: var(--el-input-bg-color, var(--el-fill-color-blank));
  background-image: none;
  border-radius: var(--el-input-border-radius, var(--el-border-radius-base));
  box-shadow: 0 0 0 1px var(--el-input-border-color, var(--el-border-color))
    inset;
  cursor: text;
  display: inline-flex;
  flex-grow: 1;
  justify-content: center;
  padding: 1px 11px;
  transform: translateZ(0);
  transition: var(--el-transition-box-shadow);
}
::v-deep .el-select > .van-field__body {
  border: 0px solid !important;
}
::v-deep .el-select-dropdown__wrap {
  height: 200px !important;
}
::v-deep .el-select--large .el-select__wrapper {
  min-height: 0px !important;
  height: 30px;
}
::v-deep .el-date-editor.el-input, .el-date-editor.el-input__wrapper {
    height: 100%;
    width: 100%;
}
</style>
